import { createApp } from 'vue'
import axios, { AxiosError, AxiosRequestConfig, AxiosResponse } from 'axios'
import App from './App.vue'
// import Antd from 'ant-design-vue';
import 'ant-design-vue/dist/reset.css';
import router from './routes/index'
import store from './store/index'
import '@/assets/styles/theme.css';
import 'cropperjs/dist/cropper.css'
import {RespData} from '@/store/respTypes'
const app = createApp(App)

export type ICustomAxiosConfig = AxiosRequestConfig & {
    opName?: string;
}
const baseBackendURL = 'http://localhost:8080'
export const baseH5URL = 'http://localhost:8080'

axios.defaults.baseURL = `${baseBackendURL}/api/`
axios.interceptors.request.use((config) => {
    const newConfig = config as ICustomAxiosConfig
    store.commit('setError', {status:false, message: ''})
    store.commit('startLoading', {opName: newConfig.opName} )
    return config
})
axios.interceptors.response.use((response: AxiosResponse<RespData>) => {
    const {config, data} = response
    const newConfig = config as ICustomAxiosConfig
    store.commit('finishLoading', {opName: newConfig.opName} )
    const {errno, message} =  data;
    if(errno){
        console.log('setError',data);
        store.commit('setError', {status: true, message})
        store.commit('finishLoading', {opName: newConfig.opName})
        // 中断在这， 避免继续走到mutation中去，导致数据错误或者运行异常
        return Promise.reject(data)
    }
    return response 
}, (e: AxiosError)=>{
    console.log('Error',e);
    const newConfig = e.config as ICustomAxiosConfig;
    store.commit('setError', {status: true, message:"服务器异常"})
    store.commit('finishLoading', {opName : newConfig.opName})
    return  Promise.reject(e);
})

app.use(router)
app.use(store)
app.mount('#app')

